<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script language="javascript">
$(function(){	
	//导航切换
	$(".imglist li").click(function(){
		$(".imglist li.selected").removeClass("selected")
		$(this).addClass("selected");
	})	
	oA = document.querySelector('#addDir');
	oA.onclick = function(event){
		event = event || window.event;
		//针对IE9以下的浏览器
		console.log("请输入目录名");
		//阻止a标签的默认行为
		dir = prompt("请输入目录名");
		console.log(dir);
		event.returnValue = false;
		
	}
})	
</script>
<style type="text/css">
	.imglist img{
		width:168px;
		height:126px;
		object-fit:cover;
		border:solid 1px #ccc;
		border-radius: 10px; 
	}
</style>
</head>
<body>

	<div class="place">
    <span>位置：</span>
    <ul class="placeul">
    <li><a href="#">首页</a></li>
    <li><a href="#">模块设计</a></li>
    <li><a href="#">图片</a></li>
    </ul>
    </div>
    
    <div class="rightinfo">
    
    <div class="tools">
    
    	<ul class="toolbar">
        <li class="click"><span><img src="images/t01.png" /></span>添加文件</li>
        <li class="click">
        	<a href="FileServlet?option=2" id="addDir">
        		<span><img src="images/t02.png" /></span>添加目录
        	</a>
        
        </li>
        <li>
        	<a href="FileServlet?option=1&pathType=2&filePath=${sessionScope.parentPath}">
        		<span><img src="images/back.png" /></span>返回
        	</a>
        </li>
        </ul>
        
        
        <ul class="toolbar1">
        <li><span><img src="images/t05.png" /></span>设置</li>
        </ul>
    
    </div>


		<ul class="imglist">
			<c:forEach items="${requestScope.myFiles}" var="myfile" varStatus="staus">
			<li class="selected">
				<c:if test="${myfile.imageType}">
					<a href="ShowImageServlet?imgPath=${myfile.file.getAbsolutePath()}" target="_blank">
						<span><img src="ShowImageServlet?imgPath=${myfile.file.getAbsolutePath()}" /></span>
					</a>
				</c:if>
				<c:if test="${!myfile.imageType}">
					<span><img src="${myfile.iconUrl}" /></span>
				</c:if>
				<h2>
					<a href="#">${myfile.file.getName()}</a>
				</h2>
				<p>
					<c:if test="${myfile.file.isFile()}">
						<a href="FileDownloadServlet?pathType=2&filepath=${myfile.file.getAbsolutePath() }">下载</a>&nbsp;&nbsp;&nbsp;&nbsp;
					</c:if>
					<c:if test="${myfile.file.isDirectory()}">
						<a href="FileServlet?option=1&pathType=2&filePath=${myfile.file.getAbsolutePath()}">打开</a>&nbsp;&nbsp;&nbsp;&nbsp;
					</c:if>
					<a href="FileServlet?option=3&pathType=2&filePath=${myfile.file.getAbsolutePath()}"">删除</a>
				</p>
			</li>
			</c:forEach>
		</ul>



		<div class="pagin">
    	<div class="message">共<i class="blue">1256</i>条记录，当前显示第&nbsp;<i class="blue">2&nbsp;</i>页</div>
        <ul class="paginList">
        <li class="paginItem"><a href="javascript:;"><span class="pagepre"></span></a></li>
        <li class="paginItem"><a href="javascript:;">1</a></li>
        <li class="paginItem current"><a href="javascript:;">2</a></li>
        <li class="paginItem"><a href="javascript:;">3</a></li>
        <li class="paginItem"><a href="javascript:;">4</a></li>
        <li class="paginItem"><a href="javascript:;">5</a></li>
        <li class="paginItem more"><a href="javascript:;">...</a></li>
        <li class="paginItem"><a href="javascript:;">10</a></li>
        <li class="paginItem"><a href="javascript:;"><span class="pagenxt"></span></a></li>
        </ul>
    </div>
    
    
    <div class="tip">
    	<div class="tiptop"><span>提示信息</span><a></a></div>
        
      <div class="tipinfo">
        <span><img src="images/ticon.png" /></span>
        <div class="tipright">
        <p>是否确认对信息的修改 ？</p>
        <cite>如果是请点击确定按钮 ，否则请点取消。</cite>
        </div>
        </div>
        
        <div class="tipbtn">
        <input name="" type="button"  class="sure" value="确定" />&nbsp;
        <input name="" type="button"  class="cancel" value="取消" />
        </div>
    
    </div>
    
    
    
    
    </div>
    

</body>

</html>
